<template>
  <div class="dept-page">
    <cell
      v-for="item in deptList"
      :key="item.departmentId"
      :title="item.name"
      @click="skipArticle(item)"
    />
  </div>
</template>

<script>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import Cell from '@/components/Cell';
import { useDeptArticle, useCurrentDeptInfo } from '@/hooks/store';
import { useService } from '@/utils/services';
export default {
  components: {
    Cell
  },
  setup() {
    const router = useRouter();
    const actions = useService();
    const { setDeptArticle } = useDeptArticle();
    const currentDeptInfo = useCurrentDeptInfo();

    const deptList = ref([]);

    actions.hos.getHospitalDeptList().then((res) => {
      deptList.value = res;
    });

    function skipArticle(item) {
      /**
       * 1. 与当前科室id 不一致
       * 2. 科室下有分类
       */
      if (currentDeptInfo.value.departmentId != item.departmentId) {
        setDeptArticle(item);
      }

      if (item.categoryStatus) {
        router.push(`/classify/0?departmentId=${item.departmentId}&title=${item.name}`);
        return;
      }

      router.push(`/article?departmentId=${item.departmentId}&title=${item.name}`);
    }

    return { setDeptArticle, skipArticle, deptList };
  }
};
</script>

<style lang="scss" scoped>
.dept-page {
  min-height: 100vh;
  background: #f7f7fa;
}
</style>